<template>
	<view>
		<view class="body after-navber" v-if="info">
			<view class="info">
				<view class="info-title flex-row">
					<view class="flex-y-center">
						<image class="info-img" :src="info.avatar"></image>
					</view>
					<view class="info-block">
						<view class="info-up info-blod">{{info.name }}</view>
						<view class="info-bottom">推荐人：{{ info.parent }}</view>
						<view class="info-bottom" v-if="info.expiration_time">到期时间：{{ info.expiration_time_text }}</view>
					</view>
				</view>
				<view class="info-content flex-row">
					<view class="info-left">
						<view class="info-label">
							<view class="info-first">可提现佣金</view>
							<view class="info-second info-blod info-big flex-row">{{ info.money }}元</view>
						</view>
					</view>
					<view class="info-right">
						<navigator class="" openType="navigate" url="/pages2/share/cash/cash?type=agent">
							<view class="info-btn">立即提现</view>
						</navigator>
					</view>
				</view>
			</view>
			<view class="new-block flex-row">
				<view class="flex-grow-1 flex-x-center">
					<view class="text-more">
						<view class="text-more" style="margin-bottom: 16rpx">已提现佣金</view>
						<view class="text-more">{{ info.tx_money }}元</view>
					</view>
				</view>
				<view class="flex-grow-1 flex-x-center">
					<view class="text-more">
						<view class="text-more" style="margin-bottom: 16rpx">待打款</view>
						<view class="text-more">{{ info.freeze_money }}元</view>
					</view>
				</view>
		 </view>
		 <view class="list flex-row">
				<navigator class="item border-bottom" url="/pages2/salesman/salesman-money/salesman-money">
					<view class="list-img flex-x-center">
						<image class="img" src="/static/images/ljyj.png"></image>
					</view>
					<view class="list-content text-more">累计佣金</view>
					<view class="flex-x-center list-content">
						<view class="list-red">{{ info.total_money }}</view>
						元
					</view>
				</navigator>
				<navigator class="item border-bottom border-between" url="/pages2/salesman/salesman-order/salesman-order">
					<view class="list-img flex-x-center">
						<image class="img" src="/pages2/static/images/806.png"></image>
					</view>
					<view class="list-content text-more">分销订单</view>
					<view class="flex-x-center list-content">
						<view class="list-red">{{ info.order_count }}</view>
						单
					</view>
				</navigator>
				<navigator class="item border-bottom" url="/pages2/share/cash-detail/cash-detail">
					<view class="list-img flex-x-center">
						<image class="img" src="/pages2/static/images/807.png"></image>
					</view>
					<view class="list-content text-more">提现明细</view>
					<view class="flex-x-center list-content">
						<view class="list-red">{{ info.tx_money }}</view>
						元
					</view>
				</navigator>
			</view>
			<view class="list flex-row">
				<navigator class="item border-bottom" url="/pages2/salesman/salesman-team/salesman-team">
					<view class="list-img flex-x-center">
						<image class="img" src="/static/images/801.png"></image>
					</view>
					<view class="list-content text-more">我的商家</view>
					<view class="flex-x-center list-content">
						<view class="list-red" v-if="info.type == 2">{{ info.store_count }} / {{ info.limit }}</view>
						<view class="list-red" v-else>{{ info.store_count }}</view>
						
					</view>
				</navigator>
				<navigator class="item border-bottom border-between" url="/pages2/salesman/salesman-code/salesman-code">
					<view class="list-img flex-x-center">
						<image class="img" src="/static/images/vCiNa2slE5mFVhxD.png"></image>
					</view>
					<view class="list-content text-more">推广商家</view>
				</navigator>
			
				<view class="item border-bottom"></view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import {
		Agent
	} from '../../../apirequest/agent-model.js';
	var a = new Agent();
	export default {
		data() {
			return {
				info: {
					
				}

			}
		},
		onShow() {
			this._index()
		},
		methods: {
			_index(){
				var that = this;
				a.get_info((res) => {
					if(res.code == 1){
						that.info = res.data
			
					}
				})
			},

		}
	}
</script>

<style>
.info {
		width: 100%;
		
	}

	.info .info-title {
		border-bottom: 1rpx #ffa2a2 solid;
		padding-bottom: 20rpx;
		background: linear-gradient(to top, #ff597d, #fd2e5a);
		border-bottom-left-radius: 20rpx;
		border-bottom-right-radius: 20rpx;
			padding: 20rpx 24rpx 60rpx 24rpx;
					color: #fff;
					
	}

	.info .info-title .info-img {
		width: 120rpx;
		height: 120rpx;
		border-radius: 120rpx;
	}

	.info .info-block {
		padding: 18rpx 40rpx;
	}

	.info .info-block .info-up {
		font-size: 13pt;
		margin-bottom: 30rpx;
	}

	.info-big {
		font-size: 13pt;
	}

	.info .info-content {
		    background: #fff;
		    padding: 22rpx 24rpx 0;
		    margin: -42rpx 24rpx 0;
		    border-top-left-radius: 10rpx;
		    border-top-right-radius: 10rpx;
	}

	.info .info-content .info-left {
		width: 50%;
	}

	.info .info-content .info-right {
		width: 50%;
		margin-top: 24rpx;
	}

	.info .info-content .info-left .info-label {
		padding-bottom: 40rpx;
	}
	.info .info-content .info-left .info-label .info-second{
		color: #FE4644
	}
	.info-label .info-first {
		margin-bottom: 24rpx;
	}

	.info-right .info-btn {
		border: 1rpx #e3e3e3 solid;
		border-radius: 10rpx;
		float: right;
		text-align: center;
		font-size: 13pt;
		margin-bottom: 24rpx;
		    padding: 11rpx 27rpx;
		background: linear-gradient(to right,#ff6d8d,#fc1849);
		color: #fff;
		font-size: 0.75rem;
	}

	.list {
		background-color: #fff;
		margin: 0 24rpx;
	}

	.list .border-bottom {
		border-bottom: 1rpx #e3e3e3 solid;
	}

	.list .item {
		width: 33.3333%;
		height: 220rpx;
		border-right: 1rpx solid #e3e3e3;
	}

	.list .item:last-child {
		border-right: 0;
	}

	.list .item .list-img {
		width: 100%;
		margin-top: 30rpx;
		text-align: center;
	}

	.list .item .list-img .img {
		width: 80rpx;
		height: 80rpx;
	}

	.list .item .list-content {
		color: #666;
		margin-top: 13rpx;
		text-align: center;
	}

	.list-red {
		color: #ff4544;
	}

	.new-block {
	    padding: 44rpx 10rpx;
	    margin: 0 24rpx 16rpx;
	    background-color: #fff;
	    border-bottom-left-radius: 10rpx;
	    border-bottom-right-radius: 10rpx;
	    border-top: 1px solid #f6f6f6;
	}

	.new-block .flex-grow-1 {
		width: 50%;
	}

	.new-block .flex-grow-1:first-child {
		border-right: 1rpx #eee solid;
	}

	.new-block .flex-grow-1 {
		text-align: center;
	}
</style>
